import { HeroModelState,HeroProps } from '@/models/hero';
import React, { FC } from 'react';
import { connect, ConnectProps } from 'umi';
import { Row, Col, Card, Radio } from 'antd'
import styles from './index.less';
import HeroItem from '@/components/HeroItem'


interface PageProps extends ConnectProps {
  hero: HeroModelState
}

const Hero: FC<PageProps> = ({ hero, dispatch }) => {
  const { heroes = [] } = hero

  
  
  return (
    <div>
      <Row>
        {
          heroes.map((hero: HeroProps) => (
            <Col key={hero.id} span={6}>
              <HeroItem data={hero} thisIndex={hero.id}/>
            </Col>
          ))
        }
      </Row>
    </div>

  )
}

export default connect(
  ({hero}:{hero:HeroModelState})=>({hero})
)(Hero)